<%@ page language="java" pageEncoding="UTF-8"%>

<%
   String ApplicationPath = request.getContextPath() ;
   String jsPath = ApplicationPath+"/js";
   String imgPath =  ApplicationPath+"/image";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>比特达智能交通运营平台（主动安全版）</title>
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" type="text/css" href="login.css"/>
<style type="text/css">
body{
   background: #2d384c;
}
.login-head{
    height:98px;
    width:100%;

    margin-top: 2px;
    z-index: 0;
}
.login-head-logImg{
   margin-top: 20px;
   margin-left: 2px;
   z-index: 1;
}
.login-head-rightImg{
   background: no-repeat;
   position: absolute;
   right: 260px;
   top:85px;
}

.center{
   width:100%;
   height:638px;
   background: url("<%=ApplicationPath%>/image2/btd-bk.jpg");
   background-size:100% 668px; 
   position:absolute;
   top: 122px;
   z-index: 0;
   
}


.loginBar {

    width: 400px;
    height:325px;
    position:absolute;
    background:url("<%=ApplicationPath%>/image2/btd-login.png");
    background-size:100% 100%; 
    opacity:0.8;
    top:115px;
    left:65%;
    z-index: 1;
    padding: 15px;
    
}

.trmessage{
   position: absolute;
   left: 150px;
   bottom: 24px;
   color: red;
   font-size: 14px;
}

.btd-user{
   position: absolute;
   left: 80px;
   top: 120px;
   font-size: 14px;
}
.nameInput{
   position: absolute;
   left: 141px;
   top: 115px;
   border-left: 0;
   border-top: 0;
}
.btd-pass{
   position: absolute;
   left: 80px;
   top: 170px;
   font-size: 14px;
}
.passInput{
   position: absolute;
   left: 141px;
   top: 166px;
}
input:-webkit-autofill 
{ box-shadow: 0 0 0px 1000px white inset !important;}

.loginBtn{
   position: absolute;
   left: 127px;
   bottom: 82px;
}

.saveCheckbox{
   width:200px;
   position: absolute;
   left: 78px;
   bottom: 38px;
   font-size: 12px;
}
.saveCheckbox-text{
   position:  absolute;
   left: 25px;
   bottom: 5px;
}

.buttom{
   position: absolute;
   top:800px;
   left: 35%;
   color: white;
   font-size: 20px;
}



.logintable tr{
		height:40px;
}

</style>

<script>

   function doValidate() {
      var userstr = document.getElementById("username").value;
      var psd = document.getElementById("password").value;
      var rd = document.getElementById("randomCode").value;
      var message = document.getElementById("message");
      var trmessage = document.getElementById("trmessage");
      if (!userstr.match(/^\S{2,20}$/)) {
         trmessage.style.display = "";
         message.innerHTML = "请输入正确的用户名";
         return false;
      }
      if (psd.length <= 0) {
         trmessage.style.display = "";
         message.innerHTML = "密码不能为空";
         return false;
      }
      trmessage.style.display = "none";
      return true;

   }

function load()
	{
		var infoTip = '<%=request.getAttribute("message")%>';
		if(infoTip.length > 0 && infoTip != 'null')
		{
			var message = document.getElementById("message");
			var trmessage = document.getElementById("trmessage");
				trmessage.style.display="";
				message.innerHTML=infoTip;
		}
		//window.setTimeout("changeValidateCode(document.getElementById('pic_random_code'));",100);

      //改变输入框背景
     // $("#nameInput").css("background-color","gray");
	}

</script>


</head>
<body style="body" onload="load()">
   <div class="login-head">
      <img class="login-head-logImg" src="<%=ApplicationPath%>/image2/btd-logo.png" />
      <img class="login-head-rightImg" src="<%=ApplicationPath%>/image2/btd-phone.png" />
   </div>
<div class="center">
   <div class="loginBar" id="loginBar">
      <form method="post" id="loginForm" name="loginForm" autocomplete="off" action="<%=ApplicationPath%>/login.action"
               onSubmit="return doValidate();">
         <div class="btd-user">用户名：</div>
         <div class="nameInput"><input type="text" name="username" id="username" tabindex="1" style="width: 216px;height:27px;" /></div>
         <div class="btd-pass">密&nbsp;&nbsp;&nbsp;&nbsp;码：</div>
         <div class="passInput"><input type="password" name="password" id="password" tabindex="2" style="width: 216px;height:27px;" /></div>
         <div class="loginBtn"><input type="image" src="<%=ApplicationPath%>/image2/btd-btn.png" onClick="" style="cursor:hand;" /></div>
         <div class="saveCheckbox">
               <input name="Fruit" type="checkbox" value="" style="width:17px;height:17px;" />
               <div class="saveCheckbox-text">记住密码</div>
         </div>
         
         <div class="trmessage" id="trmessage"> <a id="message"></a></div>
      </form>
   </div>
</div>
   <div class="buttom">
      <div>江苏比特达信息技术有限公司&nbsp;&nbsp;&nbsp;&nbsp;苏ICP备09024035号-4</div>
   </div>
 	
</body>
</html>